<template>
  <el-dialog :title="openType==='check'?'审核':'报废'" :visible.sync="open" width="600px" :close-on-click-modal="false" @close="$emit('handleSuccess')">
    <el-form :model="formData" class="detail-info" label-width="130px">
      <el-form-item label="订单号:">
        <span>{{ formData.order_id }}</span>
      </el-form-item>
      <el-form-item label="审核结果:" v-if="openType==='check'">
        <el-radio-group v-model="formData.result">
          <el-radio :label="1">通过</el-radio>
          <el-radio :label="2">驳回</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="是否报废:" v-if="openType==='cancel'">
        <el-radio-group v-model="formData.result">
          <el-radio :label="1">是</el-radio>
          <el-radio :label="2">否</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="备注:">
        <el-input v-model="formData.admin_remark" placeholder="请输入备注" type="textarea" rows="2" style="width: 360px;" />
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submitForm" :loading="exchangeLoading">确认</el-button>
      <el-button @click="$emit('handleSuccess')">取 消</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { invoiceCheck, invoiceCancel } from '@/api/invoice'
export default {
  name: 'OrderDetail',
  props: {
    open: {
      type: Boolean,
      default: false
    },
    openType: {
      type: String,
      default: 'check'
    },
    row: {
      type: Object,
      require: true
    }
  },
  data () {
    return {
      exchangeLoading: false,
      formData: {
        result: 1
      }
    }
  },
  watch: {
    open (val) {
      if (val && this.row?.order_id) {
        this.formData = {
          order_id: this.row?.order_id,
          result: 1
        }
      }
    }
  },
  methods: {
    async submitForm () {
      this.exchangeLoading = true
      const invoiceFun = this.openType === 'check' ? invoiceCheck : invoiceCancel
      invoiceFun(this.formData).then(() => {
        this.msgSuccess('操作成功')
        this.$emit('handleSuccess')
        this.exchangeLoading = false
      }).finally(() => {
        this.exchangeLoading = false
      })
    }
  }
}
</script>
<style lang="scss" scoped>
h5 {
  line-height: 30px;
  font-size: 16px;
}
</style>
